<template>

  <el-form-item class="widget-view"
                :label="label"
                v-if="element && element.key"
                @click.stop="handleSelectWidget()">
    <template v-if="element.type == 'input'"
              class="widget-col widget-view">

      <el-input v-model="form.name"
                :placeholder="element.name"
                :disabled="element.disabled"></el-input>

    </template>

  </el-form-item>

</template>

<script>
// import formRowDraggable from "./FormRow";

export default {
  name: "widget-form-item",
  props: ["element", "select", "index", "data"],
  components: {
    // formRowDraggable,
    // FmUpload,
  },
  data () {
    return {
      form: {},
      label: "这是测试",
      selectWidget: this.select,
    };
  },
  mounted () {
    console.log(this.element);

  },
  methods: {


    handleSelectWidget: function () {

      this.selectWidget = this.element;

      console.log("selected :" + this.selectWidget);
    }

  },
  watch: {
    select (val) {
      this.selectWidget = val
    },
    selectWidget: {
      handler (val) {
        console.log("select Widget watch ..." + val.key);
        this.$emit("update:select", val);
      },
      deep: true,
    }
  },
};
</script>
